<template>
    <fieldset>
        <legend>cart</legend>
        <h2>cart:购物车</h2>
        <ul>
            <li v-for="item in cartData" :key="item.id">
                <b>产品:{{item.title}}</b>
                --------
                <b>价格:{{item.price}}
                </b>--------
                <b>数量:{{item.count}}</b>
                --------
                <button @click="delCart(item)">X</button>
            </li>
        </ul>
        <h1>总价:{{total}}</h1>
    </fieldset>
</template>

<script setup>
    import { useCart } from '../../store/cart';
    import { storeToRefs } from 'pinia';
    import {useProduct} from "../../store/product"

    let cartStore = useCart()
    let productStore = useProduct()
    let {cartData,total} = storeToRefs(cartStore)
    // 删除购物车
    let delCart = (current) => {
        cartStore.del_cart(current)
        // 给商品中的库存增加
        productStore.productData.find(item=>{
            if(item.id===current.id){
                item.inventory++
            }
        })
    }
</script>